<template>
  <el-container class="box">
    <el-header><h1>注册界面</h1></el-header>
    <el-main>
      <div class="content">
        <el-form status-icon ref="ruleForm" label-width="100px" class="demo-ruleForm">
          <el-form-item label="账号：">
            <el-input v-model.number="ruleForm.merchantName"></el-input>
          </el-form-item>
          <el-form-item label="密码：">
            <el-input type="password" v-model="ruleForm.password" autocomplete="off"></el-input>
          </el-form-item>
           <el-form-item label="商家名称：">
           <el-input v-model.number="ruleForm.merchantSusuper"></el-input>
          </el-form-item>
           <el-form-item label="手机号：">
           <el-input v-model.number="ruleForm.phone" prefix-icon=el-icon-phone ></el-input>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="register">提交</el-button>
            <el-button type="primary" @click="endRouter">返回登陆</el-button>
          </el-form-item>
        </el-form>
      </div>
    </el-main>
  </el-container>
</template>

<script>
import axios from 'axios'
export default {
  data() {
    return {
      ruleForm: {
        password: "",
        merchantName: "",
        phone:"",
        merchantSusuper:''
      },
    };
  },
  methods: {
    register(){
       axios.post('/pAdmins/register',{params:{merchantName:this.ruleForm.merchantName,password:this.ruleForm.password,phone:this.ruleForm.phone,merchantSusuper:this.ruleForm.merchantSusuper}})
        .then(res=>{
          if(res.data.length != 0){
            alert('注册成功！')
            this.$router.push('/admin/login')
          }
       })
    },
   endRouter(){
     this.$router.push('/admin/login')
   }
  },
};
</script>

<style scoped>
html,
body {
  margin: 0px;
  padding: 0px;
}
.content {
  margin: 100px auto;
  width: 450px;
}
* {
  margin: 0px;
  padding: 0px;
}
body > .el-container {
  margin-bottom: 40px;
}
.box {
  height: 100vh;
}
.ures {
  width: 200px;
}
.el-header {
  background-color: rgb(158, 157, 157);
  color: #333;
  text-align: center;
  line-height: 60px;
}
.el-main {
  background-color: #77777777;
  color: #333;
  text-align: center;
  line-height: 160px;
}
</style>